<template>
  <div>
    <Echart
      :options="options"
      height="600px"
      width="470px"
    />
  </div>
</template>

<script>
import Echart from '../../../common/echart'

export default {
  components: {
    Echart
  },
  // 这里是预留给你传数据的
  props: {
    cdata: {
      type: Object,
      default: () => ({})
    }
  },
  data() {
    return {
      options: {}
    }
  },
  watch: {
    cdata: {
      handler() {
        this.options = {
          tooltip: {
            trigger: 'item',
            formatter: '{a} <br/>{b} : {c} ({d}%)'
          },
          visualMap: {
            show: false,
            min: 80,
            max: 600,
            inRange: {
              colorLightness: [0, 1]
            }
          },
          series: [
            {
              name: '访问来源',
              type: 'pie',
              radius: '55%',
              center: ['50%', '50%'],
              data: [
                { value: 335, name: '安全生产投入', itemStyle: { color: '#1890FF' }},
                { value: 310, name: '双重预防机制', itemStyle: { color: '#00D8FF' }},
                { value: 274, name: '安全生产机制', itemStyle: { color: '#2FC25B' }},
                { value: 235, name: '危险作业机制', itemStyle: { color: '#FACC14' }},
                { value: 400, name: '应急救援', itemStyle: { color: '#F04367' }}
              ].sort(function(a, b) {
                return a.value - b.value
              }),
              roseType: 'angle'
            }
          ]
        }
      },
      immediate: true,
      deep: true
    }
  }
}
</script>
